<template>
  <div class="edit-presale-warpper">
    <el-form
      ref="ruleform"
      :inline="true"
      :model="form"
      :rules="rules"
      label-width="100px"
    >
      <el-row>
        <el-form-item label="是否预售：">
          <el-radio-group v-model="form.presale_type" v-removeAriaHidden>
            <el-radio v-for="item in pageInfo.typeArr" :key="item.value" :label="item.value" :class="item.value === 0 ? 'editTypeTwo' : ''">
              {{ item.label }}
              <div v-if="item.value === 1" style="display: inline-block; margin-left: 18px; color: #000000;">
                <span>现货发货时间：</span>
                <el-select v-model="form.promise_delivery_time" placeholder="现货发货时间：" clearable filterable style="margin-left: 8px;">
                  <el-option
                    v-for="itemSon in pageInfo.deliveryTimeArr"
                    :key="itemSon.value"
                    :label="itemSon.label"
                    :value="itemSon.value"
                  />
                </el-select>
              </div>
              <div v-if="item.value === 0" style="display: inline-block; margin-left: 18px; color: #000000;">
                <span>预售发货时间：付款后</span>
                <el-input v-if="item.value === 0" v-model="form.new_title" placeholder="XX" style="width: 120px; margin: 0 8px;" />
                <span>（3-90）天内发货</span>
              </div>
            </el-radio>
          </el-radio-group>
        </el-form-item>
      </el-row>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      pageInfo: {
        typeArr: [
          {
            label: '全部现货',
            value: 1
          },
          {
            label: '全部预售',
            value: 0
          }
        ],
        deliveryTimeArr: [
          {
            label: '48小时',
            value: 172800
          },
          {
            label: '24小时',
            value: 86400
          }
        ]
      },
      form: {
        presale_type: 1,
        promise_delivery_time: 172800,
        pre_sale_days: ''
      },
      rules: {}
    }
  },
  methods: {
  }
}
</script>

<style lang="scss" scoped>
.edit-presale-warpper {
  .editTypeTwo {
    display: block;
    margin-top: 20px;
  }
}
</style>
